import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 2.15
import QtQml 2.15
import '../../../component'

Item {
	property alias playLists: gridRepeater.model
	Grid {
		id: gridLayout
		anchors.fill: parent
		columns: 3
		Repeater {
			id: gridRepeater
			Frame {
				padding: 5
				width: parent.width * 0.333
				height: parent.width * 0.1
				background:Rectangle{
					id:background
					color:Qt.color('#00000000')
				}
				clip: true
				MusicRoundImage {
					id: image
					width:parent.width *0.25
					height:parent.width*0.25
					source: modelData.album.picUrl
				}
				Text{
					id:name
					anchors.left:image.right
					anchors.horizontalCenter:parent.horizontalCenter
					anchors.verticalCenter:parent.verticalCenter
					anchors.bottomMargin:10
					anchors.leftMargin:5
					text:modelData.album.name
					font.family:window.fontFamily
					font.pointSize:11
					height:30
					width:parent.width * 0.72
					elide:Qt.ElideRight
				}
				Text{
					anchors.left:image.right
					anchors.top:name.bottom
					anchors.leftMargin:5
					text:modelData.artists[0].name
					font.family:window.fontFamily
					height:30
					width:parent.width * 0.72
					elide:Qt.ElideRight
				}
				MouseArea{
					anchors.fill:parent
					hoverEnabled:true
					cursorShape:Qt.PointingHandCursor
					onEntered:{
						background.color = Qt.color('#50000000')
					}
					onExited:{
						background.color = Qt.color('#00000000')
					}
				}
			}
		}
	}
}


